<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>书籍展示</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!-- 引入 Bootstrap -->
    <link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
    <!--判断是不是 移动设备-->
    <script type="3d172f8529a5014e46cb142f-text/javascript">
     if(navigator.userAgent.match(/(iPhone|iPod|Android|ios)/i)){
         document.getElementById("sdfdf").style.display = "block";
     }

 </script>
</head>
<body>

<script>

    /*-------------------- 获取系统当前时间方法start------------------------ */
    function datetime() {
        var now = new Date();
        document.getElementById("time").value = now.getFullYear() + "-"
            + (now.getMonth() + 1) + "-" + now.getDate();
        document.getElementById("time").value += " " + now.getHours() + ":"
            + now.getMinutes() + ":" + now.getSeconds();
    }
    window.setInterval("datetime()", 1000);
</script>

<div class="container" style="width: 100%;height: 100%;background-image: url(${pageContext.request.contextPath}/pic/car3.png);position: absolute;background-size:100% 100%">
    <div class="row clearfix"><%--<div> 标签可以把文档分割为独立的、不同的部分,块级元素.  row行，clearfix清除浮动--%>
        <div class="col-md-12 column">
            <div class="page-header">
                <h1 style="position: center">
                    停车场收费管理系统——显示所有订单
                </h1>
                <h2>
                    欢迎：${username}登录成功！
                    <a href="/admin/quit">退出</a>
                    <div class="col-lg-5  pull-right">
                   现在时间： <input id="time" style="text-align:left;"/>
                    </div>
                </h2>
            </div>
        </div>

    </div>

    <div class="row">
           <div class="col-md-4 column">
               <a class="btn btn-primary" href="${pageContext.request.contextPath}/book/toAddBook">新增订单</a>
               <a class="btn btn-primary" href="${pageContext.request.contextPath}/book/allBook">显示全部订单</a>
<%--               <a class="btn btn-primary" href="${pageContext.request.contextPath}/book/allBook">统计总收入</a>--%>
           </div>
        <div class="col-md-4 column">
        <%--查询书籍            --%>                <%--  span 行内元素   配合CSS修改网页中的一些局部信息。          --%>
            <form class="form-inline" action="/book/queryBook" method="post" style="float: right">
                <span style="color: red;font-weight: bold">${error}</span>
                <input type="text" name="queryBookName" class="form-control" required>
                <input type="submit" value="查询" class="btn btn-primary">
            </form>
        </div>
    </div>



    <div class="row clearfix">
        <div class="col-md-12 column">
            <table class="table table-hover table-striped"><%--table-hover隔行变色  table-striped有格子--%>
                <thead><%--组合 HTML 表格的表头内容。--%>
                <tr><%--tr,HTML 表格中的行。表头单元格 - 包含表头信息（由 th 元素创建） .标准单元格 - 包含数据（由 td 元素创建）--%>
                    <th>订单id</th>
                    <th>车牌号</th>
                    <th>入库时间</th>
                    <th>出库时间</th>
                    <th>支付状态</th>
                    <th>操作</th>
                </tr>
                </thead>

                <tbody><%--${list}     ${requestScope.get('list')}--%>
                <c:forEach var="book" items="${list}">
                    <tr>
                        <td>${book.getId()}</td>
                        <td>${book.getCar_number()}</td>
                        <td>${book.getEntry_date()}</td>
                        <td>${book.getLeave_date()}</td>
                        <td id="pay">${book.getPay_state()}</td>
                        <td>
                            <a href="${pageContext.request.contextPath}/book/toUpdateBook?id=${book.getId()}">支付</a> |
                            <a onclick="return confirm('确定将此记录删除?')" href="${pageContext.request.contextPath}/book/del/${book.getId()}">删除</a>
                        </td>
                    </tr>
                </c:forEach>
                </tbody>
            </table>
        </div>


</body>
</html>
